<template>
  <el-dialog ref="modalFrame"
             width="910px"
             title="提货信息"
             :visible.sync="innerVisible"
  >
    <el-form :model="model" :label-position="labelPosition" :rules="rules" ref="ruleForm" label-width="95px">
      <el-row :gutter="15">
        <el-col :span="12">
          <el-form-item label="提货联系人" prop="deliveryName">
            <el-input v-model="model.deliveryName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="提货电话" prop="deliveryPhone">
            <el-input v-model="model.deliveryPhone"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="预计提货" prop="predictDevliveryDate">
            <el-date-picker
              type="date"
              format="yyyy-MM-dd"
              placeholder="输入预计提货时间(选填)"
              v-model="model.predictDevliveryDate" style="width: 100%;"
              :picker-options="pickerOptions1"
            ></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="地址" prop="DAddress">
            <cascade-address :level="3" v-model="model.DAddress" placeholder="请选择省市区" style="width: 100%"></cascade-address>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="提货备注:" prop="deliveryMemo">
            <el-input type="textarea" :rows="3" v-model="model.deliveryMemo" placeholder="允许输入200字内"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="详情地址:" prop="deliveryAddress">
            <el-input type="textarea" :rows="3" v-model="model.deliveryAddress" placeholder="请输入详情地址"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否到货">
            {{isArriva.text}}
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="row" slot="footer">
      <el-button type="primary" :loading="costLoading"
                   @click="submitForm($event)">提交</el-button>
    </div>
  </el-dialog>
</template>
<script>
// import {isPhoneOrTel} from 'assets/scripts/base/validator'
import {copy, dotData} from '@/utils'
import moment from 'moment'
export default {
  name: 'editDelivery',
  components: {
  },
  props: {
    orderDetail: {
      type: Object,
      required: true
    },
    id: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      innerVisible: false,
      vueIf: false,
      costLoading: false,
      pickerOptions1: {
        disabledDate(time) {
          return time.getTime() < ((new Date()).getTime() - 3600 * 1000 * 24)
        }
      },
      labelPosition: 'left',
      model: {
        deliveryName: '',
        deliveryPhone: '',
        predictDevliveryDate: '',
        DAddress: [],
        deliveryMemo: '',
        deliveryAddress: ''
      },
      rules: {
        deliveryName: [
          // { required: true, message: '请填写提货联系', trigger: 'blur' }
        ],
        deliveryPhone: [
          { required: true, message: '请输入手机号', trigger: 'blur' }
          // { validator: isPhoneOrTel, message: '电话格式有误', trigger: 'blur' }
        ],
        deliveryMemo: [
          { max: 200, message: '允许输入200字内', trigger: 'blur' }
        ],
        deliveryAddress: [
          { max: 200, message: '允许输入200字内', trigger: 'blur' }
        ]
      }
    }
  },
  computed: {
    isArriva() {
      if (dotData(this.orderDetail, 'fhbOrder.isArriva') === 1) {
        return {value: 1, text: '是'}
      } else if (dotData(this.orderDetail, 'fhbOrder.isArriva') === 2) {
        return {value: 2, text: '否'}
      } else {
        return {}
      }
    }
  },
  created() {},
  methods: {
    bingData() {
      this.model.deliveryName = this.orderDetail.fhbOrderPickupInfo.deliveryName
      this.model.deliveryPhone = this.orderDetail.fhbOrderPickupInfo.deliveryPhone
      this.model.predictDevliveryDate = this.orderDetail.fhbOrder.predictDevliveryDate
      if (this.orderDetail.fhbOrderPickupInfo.deliveryProvinceNo && this.orderDetail.fhbOrderPickupInfo.deliveryCityNo && this.orderDetail.fhbOrderPickupInfo.deliveryDistrictNo) {
        this.model.DAddress = [
          {id: this.orderDetail.fhbOrderPickupInfo.deliveryProvinceNo, text: this.orderDetail.fhbOrderPickupInfo.deliveryProvince},
          {id: this.orderDetail.fhbOrderPickupInfo.deliveryCityNo, text: this.orderDetail.fhbOrderPickupInfo.deliveryCity},
          {id: this.orderDetail.fhbOrderPickupInfo.deliveryDistrictNo, text: this.orderDetail.fhbOrderPickupInfo.deliveryDistrict}
        ]
      }
      this.model.deliveryAddress = this.orderDetail.fhbOrderPickupInfo.deliveryAddress
      this.model.deliveryMemo = this.orderDetail.fhbOrderPickupInfo.deliveryMemo
    },
    show() {
      this.vueIf = false
      this.$nextTick(_ => {
        this.vueIf = true
        this.bingData()
        this.innerVisible = true
      })
    },
    hide() {
      this.innerVisible = false
    },
    submitForm($event) {
      this.$refs['ruleForm'].validate((valid) => {
        if (!valid) {
          return
        }
        this.costLoading = true
        this.$confirm('<p>是否确认提交补填的提货信息？</p>' +
          '<p>提交后补填的提货信息将推送给服务方，</p>' +
          '<p>请确认补填提货信息准确无误！</p>', '温馨提示', {
          confirmButtonText: '确认保存',
          cancelButtonText: '取消',
          center: true,
          dangerouslyUseHTMLString: true,
          type: 'warning'
        }).then(() => {
          let data = copy(this.model, true)
          data.orderId = this.id
          data.predictDevliveryDate = data.predictDevliveryDate ? moment(data.predictDevliveryDate).format('YYYY-MM-DD') : ''
          if (data.DAddress.length) {
            data.deliveryProvinceNo = dotData(data.DAddress, '[0]') || ''
            // data.deliveryProvince = data.DAddress ? data.DAddress[0].text : ''
            data.deliveryCityNo = dotData(data.DAddress, '[1]') || ''
            // data.deliveryCity = data.DAddress ? data.DAddress[1].text : ''
            data.deliveryDistrictNo = dotData(data.DAddress, '[2]') || ''
            // data.deliveryDistrict = data.DAddress ? data.DAddress[2].text : ''
          }
          delete data.DAddress
          this.$ajax.post('/ms-fahuobao-order/FhbOrder/updatePickUpInfo', data).then(response => {
            const success = dotData(response, 'success')
            if (success) {
              this.$confirm('提交成功', '提示', {
                type: 'success',
                showCancelButton: false,
                closeOnClickModal: false
              }).then(_ => {
                this.costLoading = false
                // this.$emit('refresh')
                this.innerVisible = false
                this.$router.push({path: '/redirect' + this.$route.fullPath, query: {tab: '2'}})
              })
            } else {
              this.costLoading = false
            }
          })
        }).catch(() => {
          this.costLoading = false
        })
      })
    },
    resetForm() {
      this.$refs.ruleForm.resetFields()
    }
  }
}
</script>
